<div id="id_list_compl_cargoes" xmlns:h="jakarta.faces.html"
  xmlns:f="jakarta.faces.core" xmlns:p="http://primefaces.org/ui">
  <p:outputLabel value="Not Routed Cargo"
    style="font-size: 2em; font-weight: bold" />
  <p:separator />

  <p:dataTable var="cargoNotRouted" value="#{listCargo.notRoutedCargos}"
    style="text-align: center;" id="tableNotRouted">

    <p:column headerText="Tracking ID" width="94">
      <h:link id="trackingId" value="#{cargoNotRouted.trackingId}"
        outcome="/admin/route.xhtml?faces-redirect=true"
        style="text-decoration: none;">
        <f:param name="trackingId" value="#{cargoNotRouted.trackingId}" />
        <i class="fa fa-globe" style="color: #999999;" />
      </h:link>
      <p:tooltip id="toolTipFade" for="trackingId"
        value="This cargo is not routed. Click on its tracking ID to route it!" />
    </p:column>

    <p:column headerText="Origin">
      <h:outputText value="#{cargoNotRouted.originName}  " />
      <br />
      <h:outputText value="#{cargoNotRouted.originCode}"
        style="color: #999999;font-size:.8em;" />
    </p:column>

    <p:column headerText="Destination" id="ColDest">
      <p:commandLink
        action="#{changeDestinationDialog.showDialog(cargoNotRouted.trackingId)}"
        style="text-decoration: none;" id="toUpdate">
        <h:outputText value="#{cargoNotRouted.finalDestinationName}  " />
        <br />
        <h:outputText value="#{cargoNotRouted.finalDestinationCode}"
          style="color: #999999;font-size:.8em;" />
        <i class="fa fa-edit" style="color: #999999;" />
        <p:ajax event="dialogReturn"
          listener="#{changeDestinationDialog.handleReturn}"
          update="tableNotRouted" />
        <p:tooltip id="updateToolTipFade" for="toUpdate"
          value="Click to change cargo destination." />
      </p:commandLink>
    </p:column>

    <p:column headerText="Deadline">
      <p:commandLink
        action="#{changeArrivalDeadlineDialog.showDialog(cargoNotRouted.trackingId)}"
        style="text-decoration: none;" id="arrivalDeadlineToUpdate">
        <h:outputText value="#{cargoNotRouted.arrivalDeadline}  " />
        <i class="fa fa-edit" style="color: #999999;" />
        <p:ajax event="dialogReturn"
          listener="#{changeArrivalDeadlineDialog.handleReturn}"
          update="tableNotRouted" />
        <p:tooltip id="updateToolTipFadeArrival" for="arrivalDeadlineToUpdate"
          value="Click to change cargo arrival deadline." />
      </p:commandLink>
    </p:column>
  </p:dataTable>
</div>
